<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>空HTML模板</title>
</head>
<body>

</body>
<script>
    // 首先finally会返回一个promise方便后续去链式调用，而promise.then正好就是返回一个promise，所以可以直接使用this.then
    // 其次如果callback中还使用了promise，那么后续的链式调用肯定要等到callback中的promise执行完毕，所以需要使用promise.resolve包裹callback
    // 在callback执行完之后去使用.then返回原promise的数据
    // 实现Promise的finally
    Promise.prototype.finally = function (callback){
        return this.then(
            value => Promise.resolve(callback()).then(()=>value),
            reason => Promise.resolve(callback()).then(()=>{throw reason})
        )
    }
// 示例 1: Promise 成功时的 finally 用法
const promise1 = new Promise((resolve) => {
    setTimeout(() => {
        resolve('操作成功');
    }, 1000);
});

promise1
    .then((result) => {
        console.log(result); // 输出: 操作成功
    })
    .finally(() => {
        console.log('无论 Promise 成功或失败，都会执行这里');
    });

// 示例 2: Promise 失败时的 finally 用法
const promise2 = new Promise((_, reject) => {
    setTimeout(() => {
        reject(new Error('操作失败'));
    }, 1000);
});

promise2
    .then((result) => {
        console.log(result);
    })
    .catch((error) => {
        console.error(error); // 输出: Error: 操作失败
    })
    .finally(() => {
        console.log('无论 Promise 成功或失败，都会执行这里');
    });
</script>
</html>
